<template>
  <div class="app-container">
    <el-form ref="queryForm" :model="queryParams" size="mini" inline>
      <!-- <el-form-item prop="deptId1">
        <treeselect
          v-model="queryParams.deptId1"
          class="tree-select-custom"
          :options="deptOptions"
          no-results-text="暂无数据匹配"
          no-options-text="暂无数据"
          :normalizer="normalizerDept"
          @select="getProjectList"
          placeholder="请选择所属部门"
        />
      </el-form-item>
      <el-form-item prop="projectName">
        <el-input v-model.trim="queryParams.projectName" placeholder="请输入项目名称" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item prop="randomType">
        <el-select v-model="queryParams.randomType" placeholder="检查单位" clearable style="width: 100px">
          <el-option v-for="dict in dict.type.cq_random_type" :key="dict.value" :label="dict.label" :value="dict.value" />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-date-picker
          v-model="dateRange"
          style="width: 240px"
          value-format="yyyy-MM-dd"
          type="daterange"
          range-separator="-"
          start-placeholder="检查开始日期"
          end-placeholder="检查结束日期"
        />
      </el-form-item>-->
      <el-form-item>
        <el-date-picker
          v-model="queryParams.yearMonth"
          style="width: 240px"
          value-format="yyyy-MM"
          :clearable="false"
          type="month"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
        <!--<el-button type="primary" icon="el-icon-plus" @click="handleAdd">新增</el-button>-->
      </el-form-item>
    </el-form>

    <el-table v-loading="loading" size="small" :data="list" height="calc(100vh - 160px)">
      <el-table-column label="事业部" prop="deptName" align="center" :show-overflow-tooltip="true" min-width="160" />
      <el-table-column label="城市公司" prop="threeLevelOrgName" align="center" :show-overflow-tooltip="true" min-width="150" />
      <el-table-column label="项目" prop="projectName" align="center" :show-overflow-tooltip="true" min-width="150" />
      <el-table-column label="工程得分" align="center">
        <el-table-column label="集团得分" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreJq }}</span>
          </template>
        </el-table-column>
        <el-table-column label="集团权重" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.weightJt }}</span>
          </template>
        </el-table-column>
        <el-table-column label="集群得分" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreJt }}</span>
          </template>
        </el-table-column>
        <el-table-column label="集群权重" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.weightJq }}</span>
          </template>
        </el-table-column>
        <el-table-column label="事业部得分" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreSyb }}</span>
          </template>
        </el-table-column>
        <el-table-column label="事业部权重" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.weightSyb }}</span>
          </template>
        </el-table-column>
        <el-table-column label="工程检查得分" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreGc }}</span>
          </template>
        </el-table-column>
      </el-table-column>
      <el-table-column label="品质加分" align="center" :show-overflow-tooltip="true" min-width="150">
        <el-table-column label="交付优秀" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreQmAddExec }}</span>
          </template>
        </el-table-column>
        <el-table-column label="技术创新" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreQmAddCreative }}</span>
          </template>
        </el-table-column>
        <el-table-column label="其他" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreQmAddOther }}</span>
          </template>
        </el-table-column>
      </el-table-column>
      <el-table-column label="品质减分" prop="type" align="center" :show-overflow-tooltip="true" min-width="150">
        <el-table-column label="设计违规及过失" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreQmSubGs }}</span>
          </template>
        </el-table-column>
        <el-table-column label="重大事件隐瞒不报" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreQmSubSqi }}</span>
          </template>
        </el-table-column>
        <el-table-column label="产品缺陷及质量群诉" align="center" prop="checkDate" min-width="90">
          <template slot-scope="{ row }">
            <span>{{ row.scoreQmSubQs }}</span>
          </template>
        </el-table-column>
        <el-table-column label="防渗漏C" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreQmSubSl }}</span>
          </template>
        </el-table-column>
        <el-table-column label="交房重大客诉" align="center" prop="checkDate" min-width="70">
          <template slot-scope="{ row }">
            <span>{{ row.scoreQmSubJc }}</span>
          </template>
        </el-table-column>
        <el-table-column label="安委会专项检查不合格" align="center" prop="checkDate" min-width="90">
          <template slot-scope="{ row }">
            <span>{{ row.scoreQmSubOther }}</span>
          </template>
        </el-table-column>
        <el-table-column label="是否存在特别重大事件" align="center" prop="checkDate" min-width="90">
          <template slot-scope="{ row }">
            <span>{{ row.socreQmSubAcci }}</span>
          </template>
        </el-table-column>
      </el-table-column>
      <!--<el-table-column label="操作" min-width="160" fixed="right" class-name="small-padding">
        <template slot-scope="{ row }">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(row)">修改</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(row)">删除</el-button>
        </template>
      </el-table-column>-->
    </el-table>

    <!--<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />-->

  </div>
</template>
<script>
import {
  jfkhptList
} from '@/api/checkScore/qualityManageAssess'
// import { treeselect } from '@/api/system/dept'
// import Treeselect from '@riophae/vue-treeselect'
// import '@riophae/vue-treeselect/dist/vue-treeselect.css'
// import { selectProjectExcludeCfProjectStage } from '@/api/baseManage/project'
export default {
  name: 'QualityManageAssess',
  // components: { Treeselect},
  dicts: ['cq_random_type', 'cq_engineer_deduct', 'cq_quality_bonus', 'cq_quality_deduct'],
  data() {
    return {
      loading: false,
      total: 0,
      list: [],
      // 日期范围
      dateRange: [],
      // 部门树选项
      deptOptions: [],
      // 查询参数
      queryParams: {
        deptId1: undefined,
        projectName: undefined,
        randomType: '',
        processType: undefined,
        yearMonth: ''
      },
      showSearch: true,
      showEdit: false,
      formProjectOptions: []
    }
  },
  created() {
    // this.getAuthUserProjectList()
    // this.getDeptTree()
    this.queryParams.yearMonth = this.getLastMonth()
    this.getList()
  },
  methods: {
    getLastMonth() {
      var year, lastMonth
      var date = new Date()
      var nowYear = date.getFullYear() // 当前年：四位数字
      var nowMonth = date.getMonth() // 当前月：0-11
      if (nowMonth === 0) { // 如果是0，则说明是1月份，上一个月就是去年的12月
        year = nowYear - 1
        lastMonth = 12
      } else { // 不是1月份，年份为当前年，月份本来是要减1的，但是由于`getMonth()`的月份本身就是少了1的，所以月份不用变。
        year = nowYear
        lastMonth = nowMonth
      }
      lastMonth = lastMonth < 10 ? ('0' + lastMonth) : lastMonth // 月份格式化：月份小于10则追加个0
      const lastYearMonth = year + '-' + lastMonth
      return lastYearMonth
    },
    /** 查询 品质管理考核得分 列表 */
    async getList() {
      const params = {
        countYear: '',
        countMonth: ''
      }
      if (this.queryParams.yearMonth) {
        const yearMonthArr = this.queryParams.yearMonth.split('-')
        params.countYear = yearMonthArr[0]
        params.countMonth = yearMonthArr[1]
      } else {
        this.$message.warning('请选择搜索年-月')
        return
      }
      this.loading = true
      const res = await jfkhptList(params).catch(() => false)
      this.loading = false
      if (res === false) return

      const data = res.data || []
      data.forEach(item => {
        const deptArr = []
        if (item.oneLevelOrgName) deptArr.push(item.oneLevelOrgName)
        if (item.twoLevelOrgName) deptArr.push(item.twoLevelOrgName)
        if (deptArr.length > 0) {
          item.deptName = deptArr.join(' - ')
        }
      })
      this.list = data
      this.total = res.total || 0
    },
    handleQuery() {
      this.getList()
    },
    resetQuery() {
      this.dateRange = []
      this.resetForm('queryForm')
      this.queryParams.yearMonth = this.getLastMonth()
      this.handleQuery()
    }
    // 获取授权的用户的项目列表
    // async getAuthUserProjectList() {
    //   const res = await selectProjectExcludeCfProjectStage({ needUserId: false }).catch(() => false)
    //   if (res === false) return
    //   this.formProjectOptions = res.data || []
    // },
    /** 新增按钮操作 */
    // handleAdd() {
    // },
    /** 修改按钮操作 */
    // handleUpdate(row) {
    // },
    /**
       * 查询部门与项目下拉树结构
       */
    // getDeptTree() {
    //   treeselect({}).then((response) => {
    //     this.deptOptions = response.data
    //   })
    // },
    // getProjectList(node) {
    //   this.queryParams.projectName = ''
    // },
    /** 转换检索部门数据结构 */
    // normalizerDept(node) {
    //   if (node.children && !node.children.length) {
    //     delete node.children
    //   }
    //   return {
    //     id: node.fid,
    //     label: node.label,
    //     children: node.children
    //   }
    // },
    // async handleDelete(item) {
    //   if (item.removeLoading) return
    //   const res1 = await this.$confirm('确认删除当前加减分项数据项?', '警告', { type: 'warning' }).catch(() => false)
    //   if (res1 !== 'confirm') return
    //   this.loading = true
    //   item.removeLoading = true
    //   const res = await cqGradeAddsubDelete({addsubId: item.addsubId}).catch(() => false)
    //   this.loading = false
    //   item.removeLoading = false
    //   if (res === false) return
    //
    //   this.msgSuccess('删除成功')
    //   this.list.length > 1 ? this.getList() : this.handleQuery()
    // }
  }
}
</script>
<style lang="scss" scoped>
  .tree-select-custom {
    width: 300px;
    /deep/ {
      .vue-treeselect__control {
        height: 28px;
        font-size: 12px;
      }
      .vue-treeselect__placeholder,
      .vue-treeselect__single-value {
        line-height: 26px;
      }
      .vue-treeselect__input-container,
      .vue-treeselect__input {
        height: 26px;
      }
    }
  }
  .default-level {
    color: #909399;
  }
  .green {
    color: #67c23a;
  }
  .blue {
    color: #409eff;
  }
  .red {
    color: #f56c6c;
  }
</style>
